//省市区三级联动
console.log(citys);
var province = document.getElementById("province");
var city = document.getElementById("city");
var area = document.getElementById("area");
var pro = document.getElementById("pro");
var cit = document.getElementById("cit");
var are = document.getElementById("are");
var index = 0;
var index2 = 0;
var index3 = 0;
for (var i = 0; i < citys.length; i++) {
    var provincename = citys[i].name;
    var para = document.createElement("option");
    var d = para.setAttribute("value",provincename);
    var node = document.createTextNode(provincename);
    para.appendChild(node);
    province.appendChild(para);
}
province.onchange = function () {
    index = province.selectedIndex-1;
    if(index < 0){
        index = 0;
    }
    while (city.hasChildNodes()) {
        city.removeChild(city.firstChild);
    }
    while (area.hasChildNodes()) {
        area.removeChild(area.firstChild);
    }
    index2 = 0;
    index3 = 0;
    //console.log(index,index2,index3);
    pro.innerHTML = citys[index].name;
    cit.innerHTML = citys[index].sub[0].name;
    are.innerHTML = citys[index].sub[0].sub[0].name;
    for (var j = 0; j < citys[index].sub.length; j++) {
        var cityname = citys[index].sub[j].name;
        var para2 = document.createElement("option");
        var d2 = para2.setAttribute("value",cityname);
        var node2 = document.createTextNode(cityname);
        para2.appendChild(node2);
        city.appendChild(para2);
    }
    for (var x = 0; x < citys[index].sub[0].sub.length; x++) {
        var areaname = citys[index].sub[0].sub[x].name;
        var para3 = document.createElement("option");
        var d3 = para3.setAttribute("value",areaname);
        var node3 = document.createTextNode(areaname);
        para3.appendChild(node3);
        area.appendChild(para3);
    }
}
city.onchange = function () {
    index2 = city.selectedIndex;
    while (area.hasChildNodes()) {
        area.removeChild(area.firstChild);
    }
    index3 = 0;
    //console.log(index,index2,index3);
    cit.innerHTML = citys[index].sub[index2].name;
    are.innerHTML = citys[index].sub[index2].sub[0].name;
    for (var x = 0; x < citys[index].sub[index2].sub.length; x++) {
        var areaname = citys[index].sub[index2].sub[x].name;
        var para3 = document.createElement("option");
        var d3 = para.setAttribute("value",areaname);
        var node3 = document.createTextNode(areaname);
        para3.appendChild(node3);
        area.appendChild(para3);
    }
}
area.onchange = function () {
    index3 = area.selectedIndex;
    //console.log(index,index2,index3);
    are.innerHTML = citys[index].sub[index2].sub[index3].name;
}